<!DOCTYPE html>
<html lang="en"
      xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns:v-on="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="UTF-8"/>
    <title>班级管理</title>
    <link rel="stylesheet" th:href="@{/css/bootstrap.css}" />
    <link rel="stylesheet"  th:href="@{/js/layer/layer/theme/default/layer.css}" id="layuicss-layer"/>
    <link rel="stylesheet" th:href="@{/css/basic.css}" />
    <link rel="stylesheet" th:href="@{/css/basic_pre.css}" />
    <script th:src="@{/js/lib/jquery.1.8.js}"></script>
</head>
<body>
<nav th:replace="fragment/menu :: nav-top"></nav>

<div class="container-fluid" id="app" style="margin:0 auto;">
    <div class="row">
        <div th:replace="fragment/menu::menu"></div>
        <div class="col-sm-9 col-sm-offset-3 col-md-10 col-md-offset-2 main">
            <div style="margin:20px;">
                <div class="sub-header">
                    <h2 class="sub-header-title" v-text="PageObj.title"></h2>
                    <div class="sub-header-nav">
                        <ul class="nav navbar-nav navbar-right">
                            <li><a href="#" class="btn-addItem" v-on:click="addItem()">从Excel导入</a></li>
                            <li><a href="#" class="btn-addItem" v-on:click="addItem()">新增</a></li>
                        </ul>
                        <div class="navbar-form navbar-right">
                            <input id="search_input" name="search_input" type="text" class="form-control" placeholder="Search..." v-on:change="search(search_input.value);"/>
                        </div>
                    </div>
                </div>
                <div class="panel-body" style="display:block;"></div>
                <data-table :columns="columns" :items="items"></data-table>
                <page-navigation :pageinfo="items.pageInfo"></page-navigation>
                <div-additem :columns="columns"></div-additem>
            </div>
        </div>
    </div>
</div>

<script th:replace="fragment/template4vue :: data-table" type="text/x-template"></script>
<script th:replace="fragment/template4vue :: page-navigation" type="text/x-template"></script>
<script th:replace="fragment/template4vue :: div-additem" type="text/x-template"></script>

<script th:inline="javascript">
/*<![CDATA[*/
    var userId = [[${session.userSessionId}]];

    // changeSets: 取值表的别名(在dbapi中定义),查询字段名,返回值的字段名,要填充的input名(如果没有则和返回字段名一致)
    // dbDropDown: 取值表的别名(在dbapi中定义),过滤条件,值字段,文本字段; 只在SELECT中生效
    // ddList: 为指定的列生成下拉列表,由v-on:change事件触发,对应的列要有dbDropDown属性
    var PageObj = {
        contextPath: $("#contextPath").attr("href") ? $("#contextPath").attr("href") : "",
        title: "学习小组管理",
        dataUrl: $("#contextPath").attr("href") + "/data/stugroups?whr-schoolid=11&page=1&orderBy=groupname",
        batch: ["groupname"],
        columns: {
            "uuid": {"title":"UUID", "type":"hidden"},
            "groupname": {"title":"小组名称","hint":"在名称中可用'#1->9#'样式来批量生成,如:第#1->9#小组.",},
            "schoolid": {"title":"学校代码", "type":"hidden", "ddList":"classid", "default":"11",},
            "classid": {"title":"班级", "type":"text",
                "changeSets":"classes,uuid,classname,classname",
                "dbDropDown":"classes,schoolid,uuid,classname",
            },
            "classname": {"title":"班级名称", "type":"hidden",},
            "create_time": {"title":"创建时间", "type":"hidden",},
            "create_user": {"title":"创建者ID", "type":"hidden", "default":userId},
            "status": {"title":"当前状态", "type": "select", "options":{"0":"无效", "1":"有效"}, "default":"1"},
            "joincode": {"title":"邀请码", "skip":"order,search", "hint":"不输入则自动生成随机四位数."},
            "isjoin": {"title":"是否公开", "type":"select", "options":{"0":"私有", "1":"公开"}, "default":"1"},
            "memo": {"title":"小组说明", "type":"textarea"},
        },
        items: "",
    };

    //设置缺省值及初始化
    // fetch(PageObj.contextPath + "/data/teachers?whr-userid=" + userId).then(function(response){
    //     return response.json();
    // }).then(function(data){
    //     var schoolid = data.data[0].schoolid;
    //     PageObj.columns.schoolid.default = schoolid;
    //     PageObj.dataUrl = PageObj.dataUrl.replace(/whr-schoolid=[^&]+/g, "whr-schoolid=" + schoolid);
    //     //console.log(PageObj.dataUrl);
    // });
/*]]>*/
</script>

<script th:src="@{/js/require.js}" defer="true" async="true" data-main="./js/pages/PageCommon"></script>
</body>
</html>